<template>
  <div class="d_main">
    <!-- 操作区 S-->
    <div class="d_operationBox">
      <div class="d_btn">
        <el-button type="primary" size="small" icon="el-icon-plus" v-permission="'MenuCode5-6-1'" @click="addClick">新建</el-button>
      </div>
      <div class="d_search">
      <screec
          v-model="search.QueryDataBaseFiled"
          :headData.sync="tableHead"
          :disabled="searchLoading"
        ></screec>
        <el-input
          v-model="search.likeWords"
          placeholder="请输入关键字"
          size="small"
          @keyup.enter.native="getAllLists"
        >
          <el-button
            slot="append"
            :loading="searchLoading"
            type="primary"
            icon="el-icon-search"
            :disabled="searchLoading"
            element-loading-spinner="el-icon-loading"
            @click="getAllLists"
          >
            搜索
          </el-button>
        </el-input>
      </div>
    </div>
    <!-- 操作区 E-->
    <!-- 表格操作区 S-->
    <div class="d_tableOperation">
      <div class="d_condition">

      </div>
      <div class="d_set">
        <div @click="Refresh"><i class="d_icon el-icon-refresh-right" /></div>
        <div class="setting flex">
          <HeadSeting :list-data.sync="tableHead" :table-code="$config.stockGoodsCreditList" @reset="getTableHead" />
        </div>
      </div>
    </div>
    <!-- 表格操作区 E-->
    <!--table板块-->
    <div ref="tableCon" class="tableCon">
      <el-table
        v-show="tableHead.length>0"
        id="emtable"
        ref="multipleTable"
        v-loading="searchLoading"
        :data="dataLists"
        :height="tableHeight || 'auto'"
        border
        :summary-method="getSummaries"
        show-summary
        fit
        style="width: 100%"
        @header-dragend="surverWidth"
      >
        <!-- 复选框       -->
        <!--        <el-table-column type="selection" width="40" fixed="left" />-->
        <template v-for="(fruit,index) in tableHead">
          <el-table-column
            v-if="fruit.visible"
            :key="index"
            :label="fruit.columnName"
            :min-width="fruit.columnWidth || 110"
            :prop="fruit.columnCode"
            show-overflow-tooltip
            :fixed="fruit.isFloat?'left':false"
          >
            <template slot-scope="scope">
              <template v-if="fruit.columnCode==='creditStateName'">
                <div class="flex">
                  <template v-if="scope.row.creditState===0">
                    <span class="mr5 spot" style="background: #3F61F1" /><span>{{ scope.row[fruit.columnCode] }}</span>
                  </template>
                  <template v-else>
                    <span class="mr5 spot" style="background:#67C23A" /><span>{{ scope.row[fruit.columnCode] }}</span>
                  </template>
                </div>
              </template>
              <template v-else>
                {{ scope.row[fruit.columnCode] }}
              </template>
            </template>
          </el-table-column>
        </template>
        <el-table-column label="操作" width="70px" fixed="right" align="center">
          <template slot-scope="scope">
            <div>
              <el-popover
                :ref="`popover-${scope.$index}`"
                placement="bottom-end"
                popper-class="tableOp"
                width="160"
                :popper-options="{ boundariesElement: 'opBox', removeOnDestroy: true }"
                trigger="click"
              >
                <div class="operation">
                  <ul>
                    <li @click="seeInfo(scope.row)">查看</li>
                    <li @click="updateReturnGoods(scope.row)" v-if="scope.row.creditState===0" v-permission="'MenuCode5-6-2'">修改</li>
                  </ul>
                  <ul>
                    <li @click="confirmClick(scope.row)" v-if="scope.row.creditState===0" v-permission="'MenuCode5-6-3'">确认</li>
                  </ul>
                  <ul>
                    <li @click="dleteClick(scope.row)" v-if="scope.row.creditState===0" v-permission="'MenuCode5-6-4'">删除</li>
                  </ul>
                  <!-- <ul>
                    <li @click="nullifyClick(scope.row)" v-if="scope.row.creditState===1" v-permission="'MenuCode5-6-5'">作废</li>
                  </ul> -->
                </div>
                <div slot="reference" class="opBox pointer"><span class="el-icon-more c_3F61F1" /></div>
              </el-popover>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <!-- 骨架屏     -->
      <div v-if="tableHead.length==0" class="p16">
        <el-skeleton :rows="6" animated />
      </div>
    </div>
   <!-- 分页 S-->
    <div class="d_pag">
      <pagination
        :total="total||0"
        :page.sync="search.pageIndex"
        :limit.sync="search.pageSize"
        @pagination="getAllLists"
      />
    </div>
    <!-- 分页 E-->
    <!--退货物料明细弹框    -->
    <el-dialog
      title="退货物料明细"
      :visible.sync="isReturnInfoDialog"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      width="85%"
    >
      <div class="dialogDody marDialog flex flex_column">
        <div class="btnCon flex flex_end">
          <!--      搜索框-->
          <div class="search">
            <el-input
              v-model="infoSearch.likeWords"
              placeholder="输入关键字"
              size="small"
            >
              <el-button
                slot="append"
                v-loading="returnMarLoading"
                type="primary"
                icon="el-icon-search"
                :disabled="returnMarLoading"
                element-loading-spinner="el-icon-loading"
                @click="getReturnInfo"
              >
                搜索
              </el-button>
            </el-input>
          </div>
        </div>
        <!-- 表格区域       -->
        <div class="tableCon">
          <el-table
            v-loading="returnMarLoading"
            :data="returnGoodsInfo"
            border
            style="width: 100%"
          >
            <el-table-column
              type="index"
              label="序号"
              width="55"
            />
            <el-table-column
              prop="stockGoodsCode"
              label="物料编号"
              min-width="110"
            />
            <el-table-column
              prop="stockGoodsName"
              label="物料名称"
              show-overflow-tooltip
              min-width="110"
            />
            <el-table-column
              prop="specificationName"
              label="规格型号"
              min-width="100"
            />
            <el-table-column
              prop="purchaseOrderNo"
              label="批次编码"
              min-width="100"
            />
            <el-table-column
              prop="groupName"
              label="物料分组"
              min-width="90"
            />
            <el-table-column
              prop="categoryName"
              label="物料类型"
              min-width="90"
            />
            <el-table-column
              prop="supplierName"
              label="供应商"
              min-width="90"
            />
            <el-table-column
              prop="unitName"
              label="物料单位"
              min-width="100"
            />
            <el-table-column
              prop="specificationJsValue"
              label="m²/每米"
              min-width="90"
            />
            <el-table-column
              prop="creditQuantity"
              label="退货数量"
              min-width="90"
            />
            <el-table-column
              prop="creditSquare"
              label="退货平方米"
              min-width="110"
            />
            <el-table-column
              prop="creditPrice"
              label="退货单价"
              min-width="90"
            />
            <el-table-column
              prop="creditValue"
              label="退货总金额"
              min-width="100"
            />
            <el-table-column
              prop="warehouseName"
              label="退货仓库"
              min-width="90"
            />
            <el-table-column
              prop="areaShelfName"
              label="退货库位"
              min-width="90"
            />
            <el-table-column
              prop="creditBillNo"
              label="退货单号"
              min-width="90"
            />
            <el-table-column
              prop="purchaseOrderNo"
              label="采购单号"
              min-width="90"
            />
            <el-table-column
              prop="creditDetailRemark"
              label="备注"
              min-width="150"
              show-overflow-tooltip
            />
          </el-table>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <!--    分页-->
        <div class="paginaCon noborder">
          <pagination
            :total="returnToal||0"
            :page.sync="infoSearch.pageIndex"
            :limit.sync="infoSearch.pageSize"
            @pagination="getReturnInfo"
          />
        </div>
      </div>
    </el-dialog>
    <!-- 新建退货 -->
    <el-dialog
      :title="ops === 'modify'?'修改退货单':'新建退货单'"
      :visible.sync="isAddDialog"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      width="85%"
      @close="closeDialog"
    >
      <div class="dialogDody">
        <div class="subTip">
          <span class="mr15"><span class="mr5">退货单号：</span>{{ returnForm.creditBillNo || '系统自动生成' }}</span>
          <span class="mr15"><span class="mr5">创建日期：</span>{{ returnForm.createTime || dayjs().format('YYYY-MM-DD') }}</span>
          <span><span class="mr5">创建人员：</span>{{ ops === 'modify'? returnForm.createPersonName : name }}</span>
        </div>
        <div class="addWuliaoBox">
          <el-form
            ref="returnForm"
            :model="returnForm"
            :rules="rules"
            label-width="95px"
            label-position="left"
            class="dialogForm dialogInlineForm"
          >
            <el-row>
              <el-col :span="8">
                <el-form-item label="退货类型" prop="creditType">
                  <el-select
                        filterable v-model="returnForm.creditType" placeholder="请选择入库仓库" size="mini">
                    <el-option :label="item.name" :value="item.code" v-for="item in creditTypeList" :key="item.code" />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="关联单据" prop="purchaseOrderNo">
                  <el-input v-model="returnForm.purchaseOrderNo" placeholder="关联单据" size="mini" disabled />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="退货人员">
                  <el-input
                      v-model="returnForm.creditPersonName"
                      placeholder="请输入内容"
                      size="mini"
                  >
                    <template slot="append">
                      <el-button slot="append" icon="el-icon-user" @click="isperShow=true" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="供应商" prop="supplierName">
                  <el-input v-model="returnForm.supplierName" placeholder="供应商" size="mini" disabled />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="发票号">
                  <el-input v-model="returnForm.invoiceNumber" placeholder="发票号" size="mini" disabled />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="退货备注" class="inlineText" prop="creditBillRemark">
                  <el-input v-model="returnForm.creditBillRemark" type="textarea" :rows="1" placeholder="请输入退货备注" size="mini" clearable />
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div class="tableBox">
            <div class="tt flex flex_between">
              <span class="fw">退货明细</span>
              <!-- <span class="c_3F61F1 pointer el-icon-refresh-right mr15" @click="newReturnRefresh"> 重置</span> -->
            </div>
            <el-table
              v-loading="purchaseLoading"
              :data="purchaseDetailList"
              border
              style="width: 100%"
            >
              <el-table-column
                label="物料编号"
                prop="stockGoodsCode"
                show-overflow-tooltip
                min-width="110"
              />
              <el-table-column
                  label="物料类型"
                  prop="categoryName"
                  min-width="90"
              />
              <el-table-column
                label="物料名称"
                prop="goodsName"
                show-overflow-tooltip
                min-width="110"
              />
              <el-table-column
                  label="规格型号"
                  prop="stockGoodsName"
                  min-width="90"
              />
              <el-table-column
                  label="采购数量"
                  show-overflow-tooltip
                  min-width="90"
                  prop="purchaseQuantity"
              />
              <el-table-column
                  label="库存数量"
                  show-overflow-tooltip
                  min-width="90"
                  prop="stockQuantity"
              />
              <el-table-column
                  label="已退数量"
                  show-overflow-tooltip
                  min-width="120"
                  prop="creditedQuantity"
              />
              <el-table-column
                  label="退货数量"
                  show-overflow-tooltip
                  min-width="120"
              >
                <template slot-scope="{row}">
                  <el-input v-model="row.creditQuantity" @change="changeCreditQuantity(row)" placeholder="请输入" size="mini" />
                </template>
              </el-table-column>
              <el-table-column
                  label="物料单位"
                  prop="categoryName"
                  min-width="110"
              />
              <el-table-column
                  label="单价"
                  prop="creditPrice"
                  min-width="110"
              />
              <el-table-column
                  label="总金额"
                  prop="creditValue"
                  min-width="110"
              />
              <el-table-column
                label="备注"
                show-overflow-tooltip
                min-width="150"
              >
                <template slot-scope="{row}">
                  <el-input v-model="row.creditDetailRemark" placeholder="请输入" size="mini" />
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                fixed="right"
                show-overflow-tooltip
                min-width="80"
              >
                <template slot-scope="scope">
                  <el-tooltip class="item" effect="dark" content="删除" placement="right-start">
                    <span class="pointer" @click="returnDelete(scope.$index,scope.row)"><i class="el-icon-delete" /></span>
                  </el-tooltip>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isAddDialog=false">取 消</el-button>
        <!-- 新增       -->
        <el-button
          v-if="ops === 'add'"
          v-loading="addLoading"
          :disabled="addLoading"
          element-loading-spinner="el-icon-loading"
          type="primary"
          size="mini"
          @click=" saveAdd"
        >保存</el-button>
        <!--  修改      -->
        <el-button
          v-if="ops === 'modify'"
          v-loading="addLoading"
          :disabled="addLoading"
          element-loading-spinner="el-icon-loading"
          type="primary"
          size="mini"
          @click="editSave"
        >保存</el-button>
      </div>
    </el-dialog>
    <!-- 查看退货详情 -->
    <el-dialog
      title="查看退货"
      :visible.sync="isSeeDialog"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      @close="closeDialog"
      width="85%"
    >
      <div class="dialogDody">
        <div class="subTip">
          <span class="mr15"><span class="mr5">退货单号：</span>{{ returnForm.creditBillNo || '系统自动生成' }}</span>
          <span class="mr15"><span class="mr5">创建日期：</span>{{ returnForm.createTime || dayjs().format('YYYY-MM-DD') }}</span>
          <span><span class="mr5">创建人员：</span>{{ ops === 'see'? returnForm.createPersonName : name }}</span>
        </div>
        <div class="addWuliaoBox">
          <el-form
            :model="returnForm"
            disabled
            label-width="95px"
            label-position="left"
            class="dialogForm dialogInlineForm"
          >
            <el-row>
              <el-col :span="8">
                <el-form-item label="退货类型" prop="creditType">
                  <el-select
                        filterable v-model="returnForm.creditType" placeholder="请选择入库仓库" size="mini">
                    <el-option :label="item.name" :value="item.code" v-for="item in creditTypeList" :key="item.code" />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="关联单据" prop="purchaseOrderNo">
                  <el-input v-model="returnForm.purchaseOrderNo" placeholder="关联单据" size="mini" disabled />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="退货人员">
                  <el-input
                      v-model="returnForm.creditPersonName"
                      placeholder="请输入内容"
                      size="mini"
                  >
                    <template slot="append">
                      <el-button slot="append" icon="el-icon-user" @click="isperShow=true" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="供应商" prop="supplierName">
                  <el-input v-model="returnForm.supplierName" placeholder="供应商" size="mini" disabled />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="发票号">
                  <el-input v-model="returnForm.invoiceNumber" placeholder="发票号" size="mini" disabled />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="退货备注" class="inlineText" prop="creditBillRemark">
                  <el-input v-model="returnForm.creditBillRemark" type="textarea" :rows="1" placeholder="请输入退货备注" size="mini" clearable />
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div class="tableBox">
            <div class="tt flex flex_between">
              <span class="fw">退货明细</span>
            </div>
            <el-table
                v-loading="purchaseLoading"
                :data="purchaseDetailList"
                border
                style="width: 100%"
            >
              <el-table-column
                  label="物料编号"
                  prop="stockGoodsCode"
                  show-overflow-tooltip
                  min-width="110"
              />
              <el-table-column
                  label="物料类型"
                  prop="categoryName"
                  min-width="90"
              />
              <el-table-column
                  label="物料名称"
                  prop="goodsName"
                  show-overflow-tooltip
                  min-width="110"
              />
              <el-table-column
                  label="规格型号"
                  prop="stockGoodsName"
                  min-width="90"
              />
              <el-table-column
                  label="采购数量"
                  show-overflow-tooltip
                  min-width="90"
                  prop="purchaseQuantity"
              />
              <el-table-column
                  label="已退数量"
                  show-overflow-tooltip
                  min-width="120"
                  prop="creditedQuantity"
              />
              <el-table-column
                  label="退货数量"
                  show-overflow-tooltip
                  min-width="120"
                  prop="creditQuantity"
              />
              <el-table-column
                  label="物料单位"
                  prop="categoryName"
                  min-width="110"
              />
              <el-table-column
                  label="单价"
                  prop="creditPrice"
                  min-width="110"
              />
              <el-table-column
                  label="总金额"
                  prop="creditValue"
                  min-width="110"
              />
              <el-table-column
                  label="备注"
                  show-overflow-tooltip
                  min-width="150"
                  prop="creditDetailRemark"
              />
            </el-table>
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isSeeDialog=false">取 消</el-button>
        <!--  确定      -->
        <el-button
          v-if="ops==='see'"
          type="primary"
          size="mini"
          @click="isSeeDialog=false"
        >确定</el-button>
        <!--  确认退货      -->
        <el-button
          v-if="ops==='confirm'"
          v-loading="confirmLoading"
          :disabled="confirmLoading"
          type="primary"
          size="mini"
          @click="confirmReturn"
        >确认退货</el-button>
      </div>
    </el-dialog>
    <!-- 采购单明细 -->
    <el-dialog
      title="采购单明细"
      :visible.sync="isPurInfo"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      width="85%"
    >
      <div class="dialogDody">
        <!-- 搜索     -->
        <div class="btnCon flex flex_between" style="border-bottom: none">
          <!--      搜索框-->
          <div class="search">
            <el-input
              v-model="purSearch.likeWords"
              prefix-icon="el-icon-search"
              placeholder="输入关键字"
              size="small"
              @keyup.enter.native="getPurInfo"
            >
              <!-- <el-button
                slot="append"
                v-loading="purLoading"
                type="primary"
                icon="el-icon-search"
                :disabled="purLoading"
                element-loading-spinner="el-icon-loading"
                @click="getPurInfo"
              >
                搜索
              </el-button> -->
            </el-input>
          </div>
        </div>
        <!-- 表格区域       -->
        <div class="tableCon pt0" style="padding: 16px">
          <el-table
            v-loading="purLoading"
            :data="purInfoLists"
            height="500"
            :row-class-name="tableRowClassName"
            border
            style="width: 100%"
          >
            <!-- <el-table-column
              width="55"
            >
              <template slot-scope="scope">
                <el-radio v-model="radioSelect" :label="scope.row.purchaseOrderNo" @change.native.stop="(e) => handleRadioChange(e, scope.row)">{{ '' }}</el-radio>
              </template>
            </el-table-column> -->
            <el-table-column
                prop="purchaseOrderNo"
                label="采购单号"
                min-width="110"
            />
            <el-table-column
                prop="purchaseTypeName"
                label="采购类型"
                min-width="100"
            />
            <el-table-column
                prop="createTime"
                label="采购时间"
                show-overflow-tooltip
                min-width="110"
            />
            <el-table-column
                prop="detailCount"
                label="明细"
                min-width="100"
            />
            <el-table-column
                prop="totalCount"
                label="总数量"
                min-width="90"
            />
            <el-table-column
                prop="totalAmount"
                label="采购总金额"
                show-overflow-tooltip
                width="120"
            />
            <el-table-column
                prop="expectArrivalTime"
                label="期望到货日期"
                show-overflow-tooltip
                min-width="120"
            />
            <el-table-column
                prop="supplierName"
                label="供应商"
                sortable
                min-width="120"
                show-overflow-tooltip
            />
            <el-table-column
                prop="purchasePersonName"
                label="申请人员"
                min-width="90"
            />
            <el-table-column
                prop="purchaseDesc"
                label="备注"
                min-width="150"
                show-overflow-tooltip
            >
              <template scope="{row}">
                {{ row.purchaseDesc || '--' }}
              </template>
            </el-table-column>

            <el-table-column
              label="操作"
              width="100px"
              fixed="right"
              align="center"
            >
              <template slot-scope="scope">
                <el-button
                  type="text"
                  size="medium"
                  style="color: #606266"
                  @click="confirmSelecd(scope.row)"
                >
                  选择
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <!-- <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isPurInfo=false">取 消</el-button>
        <el-button
          type="primary"
          size="mini"
          @click="confirmSelecd"
        >确定</el-button>
      </span> -->
    </el-dialog>
    <!-- 人员寻找弹框   -->
    <per-redio-dialog :per-visible.sync="isperShow" @getEmployee="getEmployee" />
    <!-- 作废原因弹框   -->
    <el-dialog
        title="拒绝原因"
        :visible.sync="reasonVisible"
        :close-on-click-modal="false"
        custom-class="comDialog"
        append-to-body
        width="30%"
        @close="closeCancelDialog"
    >
      <div class="dialogDody">
        <el-form
            ref="cancelForm"
            :model="cancelForm"
            :rules="cancelRules"
            label-width="0px"
            class="dialogForm"
        >
          <el-form-item label="" prop="remarks">
            <el-input
                v-model="cancelForm.remarks"
                type="textarea"
                :autosize="{ minRows: 2}"
                placeholder="请输入内容"
                size="mini"
                clearable
            />
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="reasonVisible=false">取 消</el-button>
        <el-button
            v-loading="addLableLoading"
            :disabled="addLableLoading"
            element-loading-spinner="el-icon-loading"
            type="primary"
            size="mini"
            @click="nullifyGoods"
        >保存</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import Pagination from '@/components/Pagination'
import HeadSeting from '@/components/HeadSeting'
import perRedioDialog from '@/components/perDialogRedio'
import { arraySort } from '@/utils'
import { mapGetters } from 'vuex'
import screec from "@/components/screen";
export default {
  name: 'ReturnGoods',
  components: { Pagination, HeadSeting, perRedioDialog,screec },
  computed: {
    ...mapGetters([
      'name',
      'userInfo'
    ])
  },
  data() {
    return {
      reasonVisible: false, // 作废弹框
      isperShow: false, // 人员选择弹框
      addLableLoading: false,
      radioSelect: null, // 采购单明细选中值 采购单号
      purchaseLoading: false,
      isSeeDialog: false, // 查看退货弹框是否打开
      isAddDialog: false, // 新建退货弹框是否打开
      confirmLoading: false, // 确认退货按钮加载效果
      ops: 'add',
      isPurInfo: false, // 采购明细弹框是否显示
      addLoading: false, // 新建退货加载效果
      isReturnInfoDialog: false, // 退货明细弹框是否打开
      returnMarLoading: false,
      searchLoading: false, // 退货列表加载效果
      tableHeight: null,
      tableHead: [], // 表头
      purInfoLists: [], // 采购明细列表
      cancelForm: {
        remarks: ''
      }, // 作废表单
      creditTypeList: [], // 退货类型列表
      returnForm: {
        creditBillNo: '', // 退货单号
        creditType: '', // 退货类型
        supplierCode: '', // 供应商code
        supplierName: '', // 供应商名称
        creditPersonName: '', // 退货人员名称
        creditPeopleCode: '', // 退货人员code
        invoiceNumber: '', // 发票号
        purchaseOrderNo: '', // 关联采购单号
        creditBillRemark: '',
        detailList: []
      }, // 新建退货表单
      purchaseDetailList: [], // 采购明细列表
      search: {
        QueryDataBaseFiled:'',
        likeWords: '',
        pageIndex: 1,
        pageSize: 30,
        supplierCode: '',
        creditState: -1
      },
      dataLists: [], // 退货分页列表
      total: 0,
      infoSearch: {
        likeWords: '',
        pageIndex: 1,
        pageSize: 30,
        creditBillNo: '',
        stockGoodsCode: '',
        warehouseCode: ''
      },
      returnGoodsInfo: [], // 退货物料明细列表
      returnToal: 0,
      purLoading: false,
      purSearch: {
        purchaseOrderState: 2,
        stockState: 1,
        likeWords: ''
      }, // 采购单明细搜索条件
      marTotale: 0,
      currentRow: [], // 采购明细选中当前项
      creditID: null,
      rules: {
        purchaseOrderNo: [
          { required: true, message: '请选择关联采购单', trigger: 'change' }
        ],
        supplierName: [
          { required: true, message: '请选择供应商', trigger: 'change' }
        ],
        creditType: [
          { required: true, message: '请选择退货类型', trigger: 'change' }
        ],
        creditBillRemark: [
          { required: true, message: '请填写退货备注', trigger: 'change' }
        ]
      },
      cancelRules: {
        remarks: [
          { required: true, message: '请填写作废原因', trigger: 'change' }
        ]
      }
    }
  },
  created() {
    // 退货列表
    this.getAllLists()
    // 退货表头
    this.getTableHead()
    // 退货物料明细
    // this.getReturnInfo()
    // 采购单明细
    this.getPurInfo()
    // 得到退货类型列表
    this.getCreditTypeList()
  },
  mounted() {
    // 表格高度
    this.calHeight()
  },
  updated() {
    this.$nextTick(() => {
      this.$refs.multipleTable.doLayout()
    })
  },
  methods: {
    // 作废点击事件
    nullifyClick(data) {
      this.reasonVisible = true
      this.creditID = data.creditID
    },
    // 作废
    nullifyGoods() {
      const params = {
        id: this.creditID,
        remarks: this.cancelForm.remarks
      }
      this.$api.warehouse.VoidStockGoodsCredit(params).then(() => {
        this.$message({
          message: '作废成功',
          type: 'success'
        })
        this.getAllLists()
      })
    },
    // 人员选择确定事件
    getEmployee(val) {
      this.returnForm.creditPeopleCode = val.employeeCode
      this.returnForm.creditPersonName = val.employeeName
    },
    // 得到退货类型列表
    getCreditTypeList() {
      this.$api.warehouse.GetAllCreditType().then(res => {
        this.creditTypeList = res
      })
    },
    // 删除退货单
    deleteReturn() {
      const parmas = {
        entityID: this.creditID
      }
      this.$confirm('确定删除吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$api.warehouse.DeleteStockGoodsCredit(parmas).then(() => {
          this.getAllLists()
          this.$message({
            message: '删除成功',
            type: 'success'
          })
        })
      })
    },
    // 确认退货
    confirmReturn() {
      const parmas = {
        entityID: this.creditID
      }
      this.$confirm('确定退货吗?,退货之后将不能更改,请慎重!', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.confirmLoading = true
        this.$api.warehouse.SureStockGoodsCredit(parmas).then(() => {
          this.isSeeDialog = false
          this.confirmLoading = false
          this.getAllLists()
          this.$message({
            message: '确认成功',
            type: 'success'
          })
        }).catch(() => {
          this.confirmLoading = false
        })
      })
    },
    // 修改保存事件
    editSave() {
      this.$refs.returnForm.validate((valid) => {
        if (valid) {
          this.addLoading = true
          this.returnForm.detailList = this.purchaseDetailList
          const parmas = this.returnForm
          this.$api.warehouse.UpdateStockGoodsCredit(parmas).then(() => {
            this.isAddDialog = false
            this.addLoading = false
            // 退货仓库列表
            this.getAllLists()
            this.$message({
              message: '修改成功',
              type: 'success'
            })
          }).catch(() => {
            this.addLoading = false
          })
        }
      })
    },
    // 获取详情
    getReturnGoodsInfo() {
      const parmas = {
        queryBy: 1,
        queryValue: this.creditID
      }
      this.$api.warehouse.GetSingleStockGoodsCredit(parmas).then(res => {
        this.returnForm = res
        this.purchaseDetailList = [...res.detailList]
        this.billState = res.creditState
      })
    },
    // 新建保存
    saveAdd() {
      this.$refs.returnForm.validate((valid) => {
        if (valid) {
          this.addLoading = true
          this.returnForm.detailList = this.purchaseDetailList
          const parmas = this.returnForm
          this.$api.warehouse.AddStockGoodsCredit(parmas).then(() => {
            this.isAddDialog = false
            this.addLoading = false
            // 退货仓库列表
            this.getAllLists()
            this.$message({
              message: '退货成功',
              type: 'success'
            })
          }).catch(() => {
            this.addLoading = false
          })
        }
      })
    },
    newReturnRefresh() {
      this.purchaseDetailList = [...this.returnForm.detailList]
    },
    returnDelete(index, data) {
      const params = {
        entityID: data.detailID
      }
      if (data.detailID) {
        this.$api.warehouse.DeleteStockGoodsCreditDetail(params).then((res) => {
          if (res.isDelete) {
            this.purchaseDetailList.splice(index, 1)
          } else {
            this.$message({
              message: '这条信息不能删除',
              type: 'warning'
            })
          }
        })
      } else {
        this.purchaseDetailList.splice(index, 1)
      }
    },
    // 退货数量改变事件
    changeCreditQuantity(row) {
      row.creditValue = row.creditQuantity * row.purchasePrice
    },
    // 采购单明细选择确定
    confirmSelecd(row) {
      const arr = JSON.parse(JSON.stringify(row.purchaseDetailsList))
      arr.forEach(item => {
        item.detailID = ''
        item.creditQuantity = 1
        item.creditPrice = item.purchasePrice
        item.creditDetailRemark = ''
        item.creditValue = 1 * item.purchasePrice
        item.areaShelfCode = item.rkAreaShelfCode
        item.areaShelfName = item.rkAreaShelfName
        item.warehouseAreaCode = item.rkWarehouseAreaCode
        item.warehouseAreaName = item.rkWarehouseAreaName
        item.warehouseCode = item.rkWarehouseCode
        item.warehouseName = item.rkWarehouseName
        item.purchaseQuantity = item.planPurchaseQuantity
        item.areaShelfName = item.rkAreaShelfName
      })
      this.purchaseDetailList = [...arr]
      this.returnForm.detailList = [...arr]
      this.returnForm.purchaseOrderNo = row.purchaseOrderNo
      this.returnForm.supplierCode = row.supplierCode
      this.returnForm.supplierName = row.supplierName
      this.returnForm.invoiceNumber = row.invoiceNumber
      this.isPurInfo = false
      this.isAddDialog = true
    },
    // 新建退货按钮点击事件
    addClick() {
      this.ops = 'add'
      this.isPurInfo = true
      this.getPurInfo() // 采购单列表
      this.returnForm.creditPeopleCode = this.userInfo.employeeCode
      this.returnForm.creditPeopleName = this.userInfo.employeeName
    },
    // 给选中一行添加class
    tableRowClassName({ row }) {
      if (this.currentRow.purchaseOrderNo === row.purchaseOrderNo) {
        return 'selectd'
      }
    },
    // 采购单明细
    getPurInfo() {
      const parmas = this.purSearch
      this.purLoading = true
      this.$api.warehouse.getRuKuPurInfo(parmas).then(res => {
        this.purInfoLists = res
        this.purLoading = false
      }).catch(() => {
        this.purLoading = false
      })
    },
    // 退货物料明细
    getReturnInfo() {
      const parmas = this.infoSearch
      this.returnMarLoading = true
      this.$api.warehouse.GetMatchPageStockGoodsCreditDetails(parmas).then(res => {
        this.returnGoodsInfo = res.list
        this.returnToal = res.totalCount
        this.returnMarLoading = false
      }).catch(() => {
        this.returnMarLoading = false
      })
    },
    // 查看退货详情
    seeInfo(data) {
      // 查看
      this.ops = 'see'
      this.creditID = data.creditID
      this.getReturnGoodsInfo()
      this.isSeeDialog = true
    },
    // 修改点击事件
    updateReturnGoods(data) {
      this.ops = 'modify'
      this.creditID = data.creditID
      this.isAddDialog = true
      // 获取详情
      this.getReturnGoodsInfo()
    },
    // 确认点击事件
    confirmClick(data) {
      this.ops = 'confirm'
      this.isSeeDialog = true
      this.creditID = data.creditID
      this.getReturnGoodsInfo()
    },
    // 删除点击事件
    dleteClick(data) {
      this.creditID = data.creditID
      this.deleteReturn()
    },
    // 退货仓库列表
    getAllLists() {
      const parmas = this.search
      this.$api.warehouse.GetMatchPageStockGoodsCredits(parmas).then(res => {
        this.dataLists = res.list
        this.dataLists.forEach((item)=>{
            for(let i in item){
              if(!item[i] && item[i] !== 0){
                item[i] = '--'
              }
            }
          })
        this.total = res.totalCount
      })
    },
    // 获取退货表头
    getTableHead() {
      const parmas = {
        tableCode: this.$config.stockGoodsCreditList
      }
      this.$api.common.getAllTableHead(parmas).then(res => {
        res.sort(arraySort('columnSort'))
        this.tableHead = res
      })
    },
    // 全部退货列表，清除所有查询条件
    Refresh() {
      this.search = this.$options.data().search
      this.getAllLists()
    },
    // 合计方法
    getSummaries(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计'
          return
        }
        if (column.property === 'creditSumValue') {
          const values = data.map(item => Number(item[column.property]))
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return prev + curr
              } else {
                return prev
              }
            }, 0)
            sums[index] = sums[index]++
          } else {
            sums[index] = ' '
          }
        }
      })

      return sums
    },
    // 保存表头样式变化
    saveHead(newArray) {
      const parmas = newArray
      setTimeout(() => {
        this.$api.common.saveTableStyle(parmas).then(() => {
        })
      }, 300)
    },
    // 保存表头列宽度
    surverWidth(newWidth, oldWidth, column) {
      setTimeout(() => {
        const heads = [...this.tableHead]
        heads.forEach(item => {
          if (item.columnCode === column.property) {
            item.columnWidth = column.width
            return
          }
        })
        this.saveHead(heads)
      }, 100)
    },
    calHeight() {
      this.$nextTick(() => {
        const rect = this.$refs.tableCon.getBoundingClientRect()
        this.tableHeight = rect.height
      })
    },
    // 关闭弹框事件
    closeDialog() {
      if (this.$refs.returnForm) {
        this.$refs.returnForm.resetFields()
      }
      this.returnForm = this.$options.data().returnForm
      this.purchaseDetailList = this.$options.data().purchaseDetailList
    },
    closeCancelDialog() {
      if (this.$refs.cancelForm) {
        this.$refs.cancelForm.resetFields()
      }
      this.cancelForm = this.$options.data().cancelForm
    }
  }
}
</script>
<style lang="scss" scoped>
.spot{
  width: 6px;
  height: 6px;
  display: inline-block;
  border-radius: 100%;
}
.subTip {
  border-bottom: 1px #e6e6e6 solid;
  background: #f5f6f9;
  padding: 8px 16px;
}
.addWuliaoBox {
  padding: 10px 16px;

  .tableBox {
    margin-top: 16px;
    border: 1px solid #e6e6e6;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    overflow: hidden;

    .tt {
      height: 38px;
      line-height: 38px;
      padding-left: 16px;
      background: #f7f8fa;
      border-radius: 8px 8px 0 0;
    }
  }
}
.paginaCon.noborder {
  border-top: none;
  text-align: left;

  .pagination-container {
    padding: 0;
  }
}
</style>
<style lang="scss">
.selectd{
  td {background: #3f61f110;}
}
</style>
